<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <link rel="stylesheet" href="./assets/layui/css/layui.css" />
  </head>
  <body>
    <div class="layui-container">
      <!--
        常规面板 2.6+
        layui-panel
       -->
      <div class="layui-row layui-col-space15">
        <div class="layui-col-md6">
          <div class="layui-panel" style="padding: 30px">常规面板 2.6+</div>
        </div>
        <div class="layui-col-md6">
          <div class="layui-panel" style="padding: 30px">常规面板 2.6+</div>
        </div>
      </div>

      <!-- 
        卡片面板
        layui-card
       -->
      <div class="layui-row layui-col-space15" style="background-color: #ededed">
        <div class="layui-col-md6">
          <div class="layui-card">
            <div class="layui-card-header">卡片面板</div>
            <div class="layui-card-body">内容</div>
          </div>
        </div>
        <div class="layui-col-md6">
          <div class="layui-card">
            <div class="layui-card-header">卡片面板</div>
            <div class="layui-card-body">内容</div>
          </div>
        </div>
      </div>

      <!-- 
        折叠面板
        layui-collapse
        开启手风琴 lay-accordion
       -->
      <div class="layui-collapse" lay-accordion>
        <div class="layui-colla-item">
          <h2 class="layui-colla-title">标题1</h2>
          <div class="layui-colla-content">内容</div>
        </div>
        <div class="layui-colla-item">
          <h2 class="layui-colla-title">标题2</h2>
          <!-- 指定哪个展开 -->
          <div class="layui-colla-content layui-show">内容</div>
        </div>
      </div>
    </div>

    <script src="./assets/layui/layui.js"></script>
    <script></script>
  </body>
</html>
